<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'houseImg.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<script type="text/javascript" src="/js/jquery-1.4.4.min.js"></script>
	<script type="text/javascript" src="/js/uploadify/swfobject.js"></script>
	<script type="text/javascript" src="/js/uploadify/task_jquery.uploadify.v2.1.4.js"></script>
	<link href="/css/uploadify.css" type="text/css" rel="stylesheet" />
	<link href="/css/homeImg.css" type="text/css" rel="stylesheet" />
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script language="javascript" type="text/javascript">
	function addimg(){
		window.location.href="homeImg.do?method=delimg";
		javascript:jQuery('#file_upload').uploadifyUpload();
	}
		$(document).ready(function() {
		$('#file_upload1').uploadify({
			'uploader'  : '/js/uploadify/uploadify.swf',
		    'script'    : '/homeImg.do?imgid=${list[0].id}',
		    'cancelImg' : '/js/uploadify/cancel.png',
		    'buttonImg' : '/images/uploadPhoto_addPhoto_btn.gif',
		    'folder'    : '/uploads',
		    'auto'      : true,
		    'multi'		: false,
		    'queueSizeLimit': '4',
		    'fileExt'   : '*.jpg;*.jpeg;*.gif;*.png;*.bmp',
			'fileDesc'  : 'Image Files (.JPG, .GIF, .PNG, .BMP)',
			'onComplete'  : function(event, ID, fileObj, response, data) {
			var newImgPath = '/images/homeimg/' + response;		
			$('#imgTarget1').attr("src",newImgPath);
			$('#imgTarget1').show();
			}
	  	});
	  	$('#file_upload2').uploadify({
			'uploader'  : '/js/uploadify/uploadify.swf',
		    'script'    : '/homeImg.do?imgid=${list[1].id}',
		    'cancelImg' : '/js/uploadify/cancel.png',
		    'buttonImg' : '/images/uploadPhoto_addPhoto_btn.gif',
		    'folder'    : '/uploads',
		    'auto'      : true,
		    'multi'		: false,
		    'queueSizeLimit': '4',
		    'fileExt'   : '*.jpg;*.jpeg;*.gif;*.png;*.bmp',
			'fileDesc'  : 'Image Files (.JPG, .GIF, .PNG, .BMP)',
			'onComplete'  : function(event, ID, fileObj, response, data) {
			var newImgPath = '/images/homeimg/' + response;		
			$('#imgTarget2').attr("src",newImgPath);
			$('#imgTarget2').show();
			}
	  	});
	  	$('#file_upload3').uploadify({
			'uploader'  : '/js/uploadify/uploadify.swf',
		    'script'    : '/homeImg.do?imgid=${list[2].id}',
		    'cancelImg' : '/js/uploadify/cancel.png',
		    'buttonImg' : '/images/uploadPhoto_addPhoto_btn.gif',
		    'folder'    : '/uploads',
		    'auto'      : true,
		    'multi'		: false,
		    'queueSizeLimit': '4',
		    'fileExt'   : '*.jpg;*.jpeg;*.gif;*.png;*.bmp',
			'fileDesc'  : 'Image Files (.JPG, .GIF, .PNG, .BMP)',
			'onComplete'  : function(event, ID, fileObj, response, data) {
			var newImgPath = '/images/homeimg/' + response;		
			$('#imgTarget3').attr("src",newImgPath);
			$('#imgTarget3').show();
			}
	  	});
	  	$('#file_upload4').uploadify({
			'uploader'  : '/js/uploadify/uploadify.swf',
		    'script'    : '/homeImg.do?imgid=${list[3].id}',
		    'cancelImg' : '/js/uploadify/cancel.png',
		    'buttonImg' : '/images/uploadPhoto_addPhoto_btn.gif',
		    'folder'    : '/uploads',
		    'auto'      : true,
		    'multi'		: false,
		    'queueSizeLimit': '4',
		    'fileExt'   : '*.jpg;*.jpeg;*.gif;*.png;*.bmp',
			'fileDesc'  : 'Image Files (.JPG, .GIF, .PNG, .BMP)',
			'onComplete'  : function(event, ID, fileObj, response, data) {	
			var newImgPath = '/images/homeimg/' + response;		
			$('#imgTarget4').attr("src",newImgPath);
			$('#imgTarget4').show();
			}
	  	});
	});
</script>
  </head>

  <body>
        <div id="homeImg">
        	<ul>
       		 <li>
        	<img id="imgTarget1" alt="无图片" src="images/homeimg/${list[0].imgurl}"/><br/>
        	<input id="file_upload1" name="file_upload1" type="file"/>
        	</li>
        		<li>
        	<img id="imgTarget2" alt="无图片" src="images/homeimg/${list[1].imgurl}"/><br/>
        	        	<input id="file_upload2" name="file_upload2" type="file"/>
        	</li>
        		<li>
        	<img id="imgTarget3" alt="无图片" src="images/homeimg/${list[2].imgurl}"/><br/>
        	        	<input id="file_upload3" name="file_upload3" type="file"/>
        	</li>
        		<li>
        	<img id="imgTarget4" alt="无图片" src="images/homeimg/${list[3].imgurl}"/><br/>
        	        	<input id="file_upload4" name="file_upload4" type="file"/>
        	</li>
        	</ul>
        </div>
        <div class="tishi">
        	<span>友情提示：请上传格式为jpg、jpeg、gif、png、bmp的图片</span><br/>
        	<span>友情提示：图片大小为703*410</span>
        </div>
  </body>
</html>
